<!--作业申请列表 -->
<template>
    <div class="page workApplyList-page" data-page="workApplyList" style="z-index: 2;">
        <div class="link-page-nav">
            <a href="#" class="link" @click="$root.backToTab()">
                <i class="iconfont icon-zuo"></i>
            </a>
        </div>
        <div class="link-page-search">
        	<span class="tt">关联的作业申请单</span>
        </div>
        <div class="page-content">
            <ul class="apply-list" id="apply-list_{{getNewId}}">
            </ul> 
        </div>   
    </div>
</template>
<style scoped>
.apply-list {
	height: 100%;
	padding-bottom: 32px;
}

.apply-list li {
	margin: 32px 20px 0 20px;
}

.apply-list li a {
	display: block;
	background: rgba(255, 255, 255, 1);
	border: 1px solid rgba(225, 225, 225, 0.9);
	box-shadow: 0px 1px 10px 0px rgba(181, 200, 206, 0.5);
	border-radius: 6px;
	padding: 17px 14px 19px 14px;
}

.apply-list li a p.workType {
	font-size: 14px;
	color: #4889D3;
}

.apply-list li a p.content {
	font-size: 17px;
	font-weight: 500;
	color: #333333;
	margin: 15px 0;
}

.apply-list li a div label {
	font-size: 14px;
	color: #666;
}

.apply-list li a div span {
	font-size: 14px;
	color: #333;
	margin-left: 5px;
}
</style>
<script>
    return {
        mounted() {
            var self = this;
            var app = self.$app;
            //页面传参
            self.taskId = this.$route.params.taskId;
        },
        data: function () {
            return {
                  //selectContent:'',
                getNewId: (new Date()).getTime(),
            }
        },
        methods: {
        	getRelateWorkApplyList:function(){//获取列表数据
                var self = this;
                var $ = self.$;
                $("#apply-list_"+self.getNewId).empty();
                //增加类别选项
                Dao.getRelateWorkApplyList({
                    userName:userInfor.accountName,
                    deviceId:appKeyObj.deviceId,
                    taskId:self.taskId,
                },function(data) {
                    if(data.length > 0){
                        for(var i=0;i<data.length;i++){
                            $("#apply-list_"+self.getNewId).append(`
                                <li>
                                    <a href="/workApplyDetail/`+data[i].id+`/0/" id="categoryId_`+data[i].id+`_`+self.getNewId+`">
                                        <p class="workType">`+data[i].typeName+`</p>
                                        <p class="content">`+data[i].workDesc+`</p>
                                        <div><label>任务周期</label><span>`+data[i].beginTime+`~`+data[i].endTime+`</span></div>
                                    </a>
                                </li>
                            `);
                            jQuery("#categoryId_"+data[i].id+"_"+self.getNewId).off("click").on("click",{'data':data[i]},function(e) {
                                    var data = e.data.data;
                                    app.router.navigate("#");
                            });
                        }
                    }else{
                        $("#apply-list_"+self.getNewId).append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                    }
                });
            },
            backToTab: function() {
                app.methods.backToTab();
            },
        },
        on: {
            pageInit: function (e, page) {
                var self = this;
                var $ = self.$;
               	self.getRelateWorkApplyList();
            },
        }
    }
</script>